<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>视频播放</title>
    <link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css" />
    <script src="https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-h5-min.js"></script>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <div class="prism-player" id="player-con" style="margin: 300px auto 0;"></div>
    <script th:inline="javascript">
    var player = new Aliplayer({
      "id": "player-con",
      "source": [[${playUrl}]],
      "width": "[[${width}]]px",
      "height": "[[${height}]]px",
      "autoplay": true,
      "isLive": false,
      "cover": "cover",
      "rePlay": false,
      "playsinline": true,
      "preload": false,
      "controlBarVisibility": "hover",
      "useH5Prism": true
    }, function (player) {
        console.log("The player is created");
      }
    );
</script>
</div>
</body>
</html>